<script type="text/javascript">
	function checkPassExist()
	{
		var oldPass = $("input:password[name=oldPass]").val();
		var url = "{$websiteURL}/controller/ajaxCheckExist.php?type=oldPass";  
		$.ajax({
	        url: url,
	        data: { oldPass: oldPass },
	        type: 'post'
		}).done(function( msg ) {
	    	if(oldPass.length > 0){
				$('#checkerr').show();
				$('#checkerr').html(msg);
	    	}else
				$('#checkerr').hide();
			  return false;	
			});
	    return false;	
	}
</script>
<!-- Themer -->  
	<div id="mws-themer">
    	<div id="mws-themer-hide"></div>
        <div id="mws-themer-content">
        	<div class="mws-themer-section">
	        	<label for="mws-theme-presets">Presets</label> <select id="mws-theme-presets"></select>
            </div>
            <div class="mws-themer-separator"></div>
            <div class="mws-themer-section">
                <ul>
                    <li><span>Base Color</span> <div id="mws-base-cp" class="mws-cp-trigger"></div></li>
                    <li><span>Text Color</span> <div id="mws-text-cp" class="mws-cp-trigger"></div></li>
                    <li><span>Text Glow Color</span> <div id="mws-textglow-cp" class="mws-cp-trigger"></div></li>
                </ul>
            </div>
            <div class="mws-themer-separator"></div>
            <div class="mws-themer-section">
            	<ul>
                    <li><span>Text Glow Opacity</span> <div id="mws-textglow-op"></div></li>
                </ul>
            </div>
            <div class="mws-themer-separator"></div>
            <div class="mws-themer-section">
	            <button class="mws-button red small" id="mws-themer-getcss">Get CSS</button>
            </div>
        </div>
        <div id="mws-themer-css-dialog">
        	<div class="mws-form">
            	<div class="mws-form-row" style="padding:0;">
		        	<div class="mws-form-item">
                    	<textarea cols="auto" rows="auto" readonly="readonly"></textarea>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Themer End -->
    

	<!-- Header Wrapper -->
	<div id="mws-header" class="clearfix">
    	<!-- Logo Wrapper -->
    	<div id="mws-logo-container" style="width:400px;align:left;margin-top : 10px; font-size: 25px; font-weight: bold;color: #C5D52B;">
            	<span>Delivery Collection Schedule</span>
	
        </div>
        
        <!-- User Area Wrapper -->
        <div id="mws-user-tools" class="clearfix">
        
        	<!-- User Notifications -->
        	<div id="mws-user-notif" class="mws-dropdown-menu">
            	<a href="#" class="mws-i-24 i-alarm-bell-2 mws-dropdown-trigger" title="10 New Alert for Delivery">a</a>
            	<div id="contentDelivery">
                </div>
            </div>
            
            <!-- User Messages -->
            <div id="mws-user-message" class="mws-dropdown-menu">
            	<a href="#" class="mws-i-24 i-alarm-clock mws-dropdown-trigger" title="10 New Alert for Collection">Messages</a>
                <div id="contentCollection">
                </div>
            </div>
            
            <!-- User Functions -->
            <div id="mws-user-info" class="mws-inset">
            	<div id="mws-user-photo">
                	<img src="{$templateDir}/temp1/css/icons/32/user_green.png" alt="User Photo" />
                </div>
                <div id="mws-user-functions">
                    <div id="mws-username">
                        Hello, {$user->getUserName()}
                    </div>
                    <ul>
                    	
                        <li><a href="#" id="mws-jui-dialog-mdl-btn">Change Password</a></li>
                        <li><a href="index.php?type=login&action=logout">Logout</a></li>
                    </ul>
                    <div id="mws-jui-dialog">
						<form class="mws-form" method="post" action="index.php?type=login&action=changePass" id="mws-validate">
                    		<div class="mws-form-inline">
                                <div class="mws-form-row">
                                    <label>Old Password</label>
                                    <div class="mws-form-item large">
                                    	 <input type="password" class="mws-textinput required" name="oldPass"
											onkeyup="checkPassExist();" /><span id="checkerr"></span>
                                    </div>
                                </div>
                                <div class="mws-form-row">
                                    <label>New Password</label>
                                    <div class="mws-form-item large">
                                    	<input type="password" id="pass" class="mws-textinput required" name="newPass" onkeyup="passwordStrength(this.value,document.getElementById('inf_pass'),document.getElementById('inf_pass'))"/>
										<span id="inf_pass" style="color: red;"></span>
                                    </div>
                                </div>
                                <div class="mws-form-row">
                                    <label>Confirm New Password</label>
                                    <div class="mws-form-item large">
                                    	<input type="password" id="conf" class="mws-textinput required" name="confirmNewPass" onkeyup="checkPass(); return false;"/>
										<span id="inf_conf" style="color: red;">*</span>
                                    </div>
                                </div>
                                <div class="" style="text-align: right;" >                    			
	                    			<input type="submit" value="Change Pass" class="mws-button green" />
	                    		</div>                               
                    		</div>                   		
                    	</form>
					</div>
                </div>
            </div>
            <!-- End User Functions -->
            
        </div>
    </div>